<template>
<div>
    <el-menu 
    :default-active="this.$router.path"
      class="el-menu-vertical-demo"
      @open="handleOpen"
      @close="handleClose"
      background-color="#545c64"
      text-color="#fff"
      active-text-color="#ffd04b"
      router
      >
        <el-submenu index="1">
        <template slot="title">
          <i class="el-icon-goods"></i>
          <span>图书管理</span>
        </template>
           <el-menu-item index="/home/bookmanage">图书管理</el-menu-item>
            <el-menu-item index="/home/catemanage">分类管理</el-menu-item>
             <el-menu-item index="/home/stockmanage">库存管理</el-menu-item>
      </el-submenu>
        <el-submenu index="2">
        <template slot="title">
          <i class="el-icon-tickets"></i>
          <span>交易管理</span>
        </template>
         <el-menu-item index="/home/ordermanage">订单管理</el-menu-item>
      </el-submenu>
           <el-submenu index="3">
        <template slot="title">
          <i class="el-icon-news"></i>
          <span>活动管理</span>
        </template>
        <el-menu-item index="/home/activitymanage">活动管理</el-menu-item>
      </el-submenu>
           <el-submenu index="4">
        <template slot="title">
          <i class="el-icon-setting"></i>
          <span>系统设置</span>
        </template>
        <el-menu-item index="/home/usermanage">用户管理</el-menu-item>
      </el-submenu>
             <el-submenu index="5">
        <template slot="title">
          <i class="el-icon-share"></i>
          <span>服务监控</span>
        </template>
        <el-menu-item index="/home/systemlog">系统日志</el-menu-item>
      </el-submenu>
    </el-menu>
</div>
</template>
    

<script>
  export default {
      name:"LeMenu",
    methods: {
      handleOpen(key, keyPath) {
        console.log(key, keyPath);
      },
      handleClose(key, keyPath) {
        console.log(key, keyPath);
      }
    }
  }
</script>
<style scoped>

</style>